<template>
  <div class="ant-table-body">
    <!-- 表格 -->
    <div class="layer-box">
      <div class="layer">
        <table id="bbb">
          <!-- 表头 -->
          <thead class="ant-table-thead">
            <tr>
              <!-- 项目标题 -->
              <th class="ant-table-row-cell-break-word resize-table-th th-title">
                <div class="title">
                  <div class="orderNumber">
                    <!-- 全选 -->
                    <a-checkbox :indeterminate="indeterminate" :checked="checkAll" @change="onCheckAllChange">
                    </a-checkbox>
                  </div>
                  <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-faguangdengpao"></use>
                  </svg>
                  <span>项目标题</span>
                  <button class="btn-add" @click="addProject">添加</button>
                </div>
              </th>
              <!-- 类型 -->
              <th class="ant-table-row-cell-break-word resize-table-th th-type">
                <div class="type">
                  <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-wenjianleixingFileTypes11"></use>
                  </svg>
                  类型
                </div>
              </th>
              <!-- 成员 -->
              <th class="ant-table-row-cell-break-word resize-table-th th-member">
                <div class="member">
                  <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-tuanduichengyuan"></use>
                  </svg>
                  成员
                </div>
              </th>
              <!-- 标记 -->
              <th class="ant-table-row-cell-break-word resize-table-th th-mark">
                <div class="mark">
                  <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-biaoqian"></use>
                  </svg>
                  标记
                </div>
              </th>
              <!-- 评分 -->
              <th class="ant-table-row-cell-break-word resize-table-th th-grade">
                <div class="grade">
                  <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-pingfen"></use>
                  </svg>
                  评分
                </div>
              </th>
              <!-- 入库时间 -->
              <th class="ant-table-row-cell-break-word resize-table-th th-storeTime">
                入库时间
              </th>
              <!-- 额外属性 -->
              <th v-for="(item,index) in tableAttr" :key="index" class="th-extra">{{item}}</th>
              <!-- 设置 -->
              <th class="ant-table-row-cell-break-word resize-table-th th-setting">
                <div class="setting" @click.stop="setting = true">
                  <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-shezhi"></use>
                  </svg>
                </div>
                <!-- 额外属性 -->
                <div class="setting-show" v-show="setting" ref="showSet">
                  <div class="all-column">
                    <div class="table-column">
                      <div class="column-select">
                          <a-checkbox checked></a-checkbox>
                      </div>
                      <div class="column-name">项目标题</div>
                    </div>
                    <div class="table-column">
                      <div class="column-select">
                        <a-checkbox checked></a-checkbox>
                      </div>
                      <div class="column-name">类型</div>
                    </div>
                    <div class="table-column">
                      <div class="column-select">
                        <a-checkbox checked></a-checkbox>
                      </div>
                      <div class="column-name">成员</div>
                    </div>
                    <div class="table-column">
                      <div class="column-select">
                        <a-checkbox checked></a-checkbox>
                      </div>
                      <div class="column-name">标记</div>
                    </div>
                    <div class="table-column">
                      <div class="column-select">
                        <a-checkbox checked></a-checkbox>
                      </div>
                      <div class="column-name">评分</div>
                    </div>
                    <div class="table-column">
                      <div class="column-select">
                        <a-checkbox checked></a-checkbox>
                      </div>
                      <div class="column-name">入库时间</div>
                    </div> 
                    <!-- 额外属性 -->
                    <div class="table-column" v-for="(item,index) in extraAttribute" :key="index">
                      <div class="column-select">
                        <a-checkbox :checked="item.checked" @change="attr(item)"></a-checkbox>
                      </div>
                      <div class="column-name">{{item.value}}</div>
                    </div>
                  </div>

                  <hr />

                  <div class="set-column" @click="attributeConfig">
                    <svg class="icon" aria-hidden="true">
                      <use xlink:href="#icon-shezhi"></use>
                    </svg>
                    添加项目属性
                  </div>
                </div>
              </th>
            </tr>
          </thead>

          <tbody class="ant-table-tbody">
            <tr class="ant-table-row ant-table-row-level-0" v-for="(item, index) in tableData" :key="index"
              @mouseenter="item.showCheck = true" @mouseleave="item.showCheck = false">
              <template v-if="item.isEmpty">
                <td class="ant-table-row-cell-break-word td-title"></td>
                <td class="ant-table-row-cell-break-word"></td>
                <td class="ant-table-row-cell-break-word"></td>
                <td class="ant-table-row-cell-break-word"></td>
                <td class="ant-table-row-cell-break-word"></td>
                <td class="ant-table-row-cell-break-word"></td>
                <td class="ant-table-row-cell-break-word" v-for="(item,index) in tableAttr" :key="index"></td>
                <td class="ant-table-row-cell-break-word td-setting"></td>
              </template>
              <template v-else>
                <!-- 项目标题 -->
                <td class="ant-table-row-cell-break-word td-title">
                  <div class="title">
                    <div class="orderNumber" v-if="item.checked || item.showCheck">
                      <a-checkbox :checked="item.checked" @change="onCheck((item.checked = $event.target.checked),item)">
                      </a-checkbox>
                    </div>
                    <div class="orderNumber" v-else>
                      {{ index + 1 }}
                    </div>
                    <div class="titleName">
                      {{ item._title }}
                    </div>
                    <!-- 移入显示全部 -->
                    <div class="allTitleName" v-if="item.ellipsis">
                      {{ item.title }}
                    </div>
                  </div>
                </td>
                <!-- 类型 -->
                <td class="ant-table-row-cell-break-word td-type">
                  <span>{{  item.type }}</span>
                </td>
                <!-- 成员 -->
                <td class="ant-table-row-cell-break-word td-member">
                  <span>
                    {{ item.members }}
                  </span>
                </td>
                <!-- 标记 -->
                <td class="ant-table-row-cell-break-word">
                  {{ item.tags }}
                </td>
                <!-- 评分 -->
                <td class="ant-table-row-cell-break-word">
                  <div>
                    <!-- allow-half -->
                    <a-rate :value="item.score" disabled  allow-half/>
                  </div>
                </td>
                <!-- 入库时间 -->
                <td class="ant-table-row-cell-break-word">
                  {{ item.createTime | formatDateTime }}
                </td>
                <!-- 额外属性 -->
                <td v-for="(item,index) in tableAttr" :key="index"></td>
                <!-- 操作 -->
                <td class="ant-table-row-cell-break-word td-setting">
                  <div class="action" ref="init">
                    <div v-if="item.checked || item.showCheck" class="opreate">
                      <div class="selectIcon" @click="detail(item)">
                        <svg class="icon" aria-hidden="true">
                          <use xlink:href="#icon-quanping"></use>
                        </svg>
                      </div>
                      <!-- delete -->
                      <div class="selectIcon" @click="handlerdelete(item)">
                        <svg class="icon" aria-hidden="true">
                          <use xlink:href="#icon-shanchu1"></use>
                        </svg>
                      </div>
                    </div>
                  </div>
                </td>
              </template>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
    <!-- 分页 -->
    <div class="page">
      <ul>
        <li v-for="(page, index) in pageCounts" :key="index" @click="goto(page, index)">
          <span :class="{ active: current == index }">{{ page }}</span>
        </li>
      </ul>
    </div>
    <!-- 选中时弹出底部菜单 -->
    <div class="btm-box" v-if="showOther && showSelect">
      <div class="btm-menu">
        <span class="btm-select"> 已选择{{ b }}个项目 </span>
        <!-- 批量移动 -->
        <div class="show" @mouseover="showSort = true" @mouseout="showSort = false">
          <span class="btm-span">
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-faguangdengpao"></use>
            </svg>
            批量移动到
          </span>
          <!-- 分类选项 -->
          <div class="btm-sort" v-show="showSort">
            <div v-for="(item, index) in allType" :key="index" @click="batchMove(item)">
              <a>{{item.value}}</a>
            </div>
            <div @click="batchMove()">
              <a>未分类项目</a>
            </div>
          </div>
        </div>
        <!-- 批量复制 -->
        <div class="show" @mouseover="copySort = true" @mouseout="copySort = false">
          <span class="btm-span">
            <svg class="icon" aria-hidden="true">
              <use xlink:href="#icon-fuzhi"></use>
            </svg>
            批量复制到
            <!-- 分类选项 -->
            <div class="btm-copy" v-show="copySort">
              <div v-for="(item, index) in allType" :key="index" @click="batchCopy(item)">
                <a>{{item.value}}</a>
              </div>
              <div @click="batchCopy()">
                <a href="" >未分类项目</a>
              </div>
            </div>
          </span>
        </div>
        <!-- 批量删除 -->
        <span class="btm-delete" @click="batchDel">
          <svg class="icon" aria-hidden="true">
            <use xlink:href="#icon-shanchu1"></use>
          </svg>
          删除
        </span>

        <span class="btm-close" @click="closeSelect">
          <svg class="icon" aria-hidden="true">
            <use xlink:href="#icon-cuowuguanbiquxiao"></use>
          </svg>
        </span>
      </div>
    </div>
  </div>
</template>

<script>
import { mapActions, mapState } from 'vuex';



// 计算字符串长度
function calcLength(str) {
    var realLength = 0
    var charCode = -1
    for ( var i = 0; i < str.length; i++ ){
      charCode = str.charCodeAt(i);
      if (charCode >= 0 && charCode <= 255){
        realLength += 1;
      }else {
         realLength += 2;
      }
    }
    return realLength;
}

// 文本超出区域显示省略号
function wordlimit(str, width) {
  var realLength = calcLength(str);

  var i = realLength*10
  if (i > width) {
    var b = width / 20;
    var str = str.slice(0, b) + "...";
    return [str,true];
  }
  if (i < width){
    return [str,false];
  }
}
export default {
  name: "projectTable",
  props: ["getType", "getScore", "getDate", "getWord", "getTag","prodata"],
  data() {
    return {
      tableData: [],
      itemList: [], //多选
      allItemList: [],//全选
      tableAttr: [],//表格属性
      showAll: false,//显示隐藏文字
      showAllType: false,
      indeterminate: false,
      checkAll: false,
      current: 0, //当前页码-1
      showItem: "", //展示页数
      allpage: "", //总页码
      pageSize: 16, //每页显示记录数
      setting: false, //表格属性列设置
      showSort: false, //批量移动到
      copySort: false, //批量复制到
      showSelect: false,
      typeSort: this.getType, //类型
      tagSort: this.getTag, //标记
      keyWord: this.getWord, //关键字
      scoreSort: this.getScore, //分数
      dateSort: this.getDate, //日期
    };
  },
  computed: {
    // 分页器初始化页数
    pageCounts: function () {
      var page = [];
      if (this.current < this.showItem) {
        var i = Math.min(this.showItem, this.allpage);
        while (i) {
          page.unshift(i--);
          // console.log(i)
        }
      } else {
        var middle = this.current - Math.floor(this.showItem / 2),
          i = this.showItem;
        if (middle > this.allpage - this.showItem) {
          middle = this.allpage - this.showItem + 1;
        }
        while (i--) {
          page.push(middle++);
        }
      }
      return page;
    },
    // 已选择项目数量
    b: function () {
      var i = 0;
      this.tableData.forEach((item, index) => {
        if (item.checked == true) {
          i++;
        }
      });
      return i;
    },
    // 选中时弹出
    showOther() {
      if (this.b !== 0) {
        return true;
      } else {
        return false;
      }
    },
    // 过滤表格数据
    table() {
      var tab = this.tableData.filter(function (item) {
        return item.isEmpty !== true;
      });
      return tab;
    },
    ...mapState({
      // 额外属性
      extraAttribute:(state) => state.attribute.allAttribute,
      // 所有类型
      allType: (state) => state.project.types,
      // 是否有新增数据
      isNewData: (state) => state.project.haveData,
      // 是否显示新增数据
      showData: (state) => state.project.showNewData,
      // 抓取的新增数据
      newData: (state) => state.project.newTableData,
    }),

  },
  created() {
    this.project(); //加载全部
  },
  async mounted() {
      // 表格滚动条滚动时分界线
      let doc = document.getElementsByClassName('layer')[0]
      // 第一列
      let leftFixs = doc.getElementsByClassName("th-title");
      let leftFixsTd = doc.getElementsByClassName("td-title");
      // 最后一列
      let rightFixs = doc.getElementsByClassName('th-setting')
      let rightFixsTd = doc.getElementsByClassName('td-setting')
      let tab = doc.getElementsByTagName('table')[0]
	
		  {
	        [...rightFixs].forEach(item => {
	          item.classList.remove('box-shadow')
	        });
          [...rightFixsTd].forEach(item => {
	          item.classList.remove('box-shadow')
	        });
	     }
      // 监听滚动条滚动变化
      doc.addEventListener('scroll', function(e) {
        // 最后一列
        if (e.target.scrollLeft < tab.clientWidth - doc.clientWidth && e.target.scrollLeft > 0) {
          [...rightFixs].forEach(item => {
            item.classList.add('box-shadow')
          });
          [...rightFixsTd].forEach(item => {
	          item.classList.add('box-shadow')
	        });   
        } else {
          [...rightFixs].forEach(item => {
            item.classList.remove('box-shadow')
          });
          [...rightFixsTd].forEach(item => {
	          item.classList.remove('box-shadow')
	        });
        };
        // 第一列
        if (e.target.scrollLeft > 0) {
           [...leftFixs].forEach((item) => {
            item.classList.add("box-shadow");
          });
          [...leftFixsTd].forEach((item) => {
            item.classList.add("box-shadow");
          });
        }else {
           [...leftFixs].forEach((item) => {
            item.classList.remove("box-shadow");
          });
          [...leftFixsTd].forEach((item) => {
            item.classList.remove("box-shadow");
          });
        };
        // 
        if (e.target.scrollLeft == 0) {
          [...rightFixs].forEach(item => {
            item.classList.add('box-shadow')
          });
          [...rightFixsTd].forEach(item => {
	          item.classList.add('box-shadow')
	        });   
        }

      }, true)
    // 初始化项目额外属性
    this.initAttribute();
    //文本超出隐藏
    this.calcWidth();
    // 窗口大小变换时执行事件
    window.onresize = () => {
      // 计算table第一个单元格的宽度
      this.calcWidth();
      this.$store.commit('setWindowWidth', document.body.clientWidth);
    };
    // 点击区域外面隐藏
    document.addEventListener("click", (e) => {
      if (this.$refs.showSet) {
        let isShow = this.$refs.showSet.contains(e.target);
        if (!isShow) {
          this.setting = false;
        }
      }
    });
  },

  methods: {
    // 额外属性选择
    attr(item){
      this.$store.commit('setChecked',item,);
      var arrs = []
      this.extraAttribute.forEach((item)=> {
        if(item.checked == true){
          arrs.push(item.value)
        }
      })
      this.tableAttr = arrs;
      this.calcWidth();
      let www = document.getElementById("bbb").rows[0].cells[0].offsetWidth;
      if (www == 350) {
        let doc = document.getElementsByClassName('layer')[0]
        let rightFixs = doc.getElementsByClassName('th-setting')
        let rightFixsTd = doc.getElementsByClassName('td-setting');
         [...rightFixs].forEach(item => {
	          item.classList.add('box-shadow')
	        });
          [...rightFixsTd].forEach(item => {
	          item.classList.add('box-shadow')
	        });
      }
    },
    // 获取项目额外属性
    ...mapActions({ initAttribute: 'initAttribute'}),
    // 表格单选
    onCheck(e, item) {
      let a = 0;
      if ((e = true)) {
        this.table.forEach((item) => {
          if (item.checked == true) {
            this.itemList = this.table.filter((item) => {
              return item.checked == true;
            });
            a++;
          }
        });
        if (a == 0) {
          this.indeterminate = false;
        }
        if (a == this.table.length) {
          this.checkAll = true;
        }
        if (a != 0 && a != this.table.length) {
          this.indeterminate = true;
        }
      }
      this.showSelect = true;
      this.$emit("getCheckedDatas", this.itemList)
    },
    // 表格全选
    onCheckAllChange(item) {
      this.indeterminate = false;
      this.checkAll = !this.checkAll;
      if (this.checkAll) {
        this.table.forEach((item, index) => {
          item.checked = true;
        });
        this.allItemList = this.table
        this.$emit("getCheckedDatas", this.table)
      }else {
         this.table.forEach((item) => {
          item.checked = !item.checked;
        });
        this.allItemList = []
        this.$emit("getCheckedDatas", [])
      }
      this.showSelect = true;
    },
    // 分页器
    goto(page, index) {
      this.current = index;
      this.project();
      console.log(this.current);
    },
    // 关闭选中时弹出的菜单
    closeSelect() {
      this.showSelect = false;
      this.table.forEach((item, index) => {
        if (item.checked) {
          item.checked = !item.checked;
        }
      });
      this.indeterminate = false;
      this.checkAll = false;
    },
    // 文本超出隐藏
    hide(titleWidth) {
      for (var i = 0; i < this.tableData.length; i++) {
        if(this.tableData[i].isEmpty == true) continue
        // 标题超出显示省略号
        if (this.tableData[i].title != null) {
          var str = this.tableData[i].title;
          this.tableData[i]._title = wordlimit(str, titleWidth)[0];
          this.tableData[i].ellipsis = wordlimit(str, titleWidth)[1];
        }
      }
    },
    // 计算表格单元格宽度
    calcWidth(www) {
      var www = document.getElementById("bbb").rows[0].cells[0].offsetWidth;
      if (window.innerWidth > 1450) {
        // 项目标题宽度计算
        var titleWidth =  www
        this.hide(titleWidth);
      }else {
        var titleWidth = 1450-1050
        this.hide(titleWidth);
      }
    },
    // 删除
    handlerdelete(item) {
      let id = item.id;
      if (id) {
        this.$confirm(`是否确认删除`,async ()=> {
          let res = await this.$api.projectMessage.delete(id);
          if (res.code == "success") {
            this.$message.success('删除成功！');
            this.project();
          }else {
            this.$message.error('删除失败！');
          }
        })
      }
    },
    // 批量删除
    batchDel(){
      var ids = []
      if (this.itemList) {
        this.itemList.forEach((item) => {
          ids.push(item.id)
        })
      }
      if (this.allItemList) {
        this.allItemList.forEach((item) => {
          ids.push(item.id)
        })
      }
      this.$confirm('是否确认删除',async () => {
        let res = await this.$api.projectMessage.batchDel(ids);
        if (res.code = "success") {
          this.$message.success("删除成功！");
          this.indeterminate = false;
          this.project();
        }else {
          this.$message.error("删除失败！");
        }
      })
    },
    // 批量移动
    batchMove(item){
      if (item) {
        var type = item.value
        var ids = []
        if (this.itemList) {
          this.itemList.forEach((item) => {
            let id = item.id
            ids.push({id,type})
          })
        }
        if (this.allItemList) {
          this.allItemList.forEach((item) => {
            let id = item.id
            ids.push({id,type})
          })
        }
        this.$confirm(`是否确认将项目批量移动到${type}`,async () => {
          let res = await this.$api.projectMessage.batchMove(ids);
          if (res.code = "success") {
            this.$message.success("批量移动成功！");
            this.indeterminate = false;
            this.project();
          }else {
            this.$message.error("批量移动失败！");
          } 
        })
      }else {
        var type = "未分类项目"
        var ids = []
        if (this.itemList) {
          this.itemList.forEach((item) => {
            let id = item.id
            ids.push({id,type})
          })
        }
        if (this.allItemList) {
          this.allItemList.forEach((item) => {
            let id = item.id
            ids.push({id,type})
          })
        }
        this.$confirm(`是否确认将项目批量移动到${type}`,async () => {
          let res = await this.$api.projectMessage.batchMove(ids);
          if (res.code = "success") {
            this.$message.success("批量移动成功！");
            this.indeterminate = false;
            this.project();
          }else {
            this.$message.error("批量移动失败！");
          } 
        })
      }
    },
    // 批量复制
    batchCopy(item) {
      if (item) {
        var type = item.value
        var ids = []
        if (this.itemList) {
          this.itemList.forEach((item) => {
            let id = item.id
            ids.push({id,type})
          })
        }
        if (this.allItemList) {
          this.allItemList.forEach((item) => {
            let id = item.id
            ids.push({id,type})
          })
        }
        this.$confirm(`是否确认将项目批量复制到${type}`,async () => {
          let res = await this.$api.projectMessage.batchCopy(ids);
          if (res.code = "success") {
            this.$message.success("批量复制成功！");
            this.indeterminate = false;
            this.project();
          }else {
            this.$message.error("批量复制失败！");
          } 
        })
      }else {
        var type = "未分类项目"
        var ids = []
        if (this.itemList) {
          this.itemList.forEach((item) => {
            let id = item.id
            ids.push({id,type})
          })
        }
        if (this.allItemList) {
          this.allItemList.forEach((item) => {
            let id = item.id
            ids.push({id,type})
          })
        }
        this.$confirm(`是否确认将项目批量复制到${type}`,async () => {
          let res = await this.$api.projectMessage.batchCopy(ids);
          if (res.code = "success") {
            this.$message.success("批量复制成功！");
            this.indeterminate = false;
            this.project();
          }else {
            this.$message.error("批量复制失败！");
          } 
        })
      }
    },
    // 新增项目
    addProject(){
      // var type = "未分类项目";
      const addData = {
        type:"未分类项目",
        title:"未命名项目"
      }
      this.$confirm('是否确认添加项目',async () => {
        let res = await this.$api.projectMessage.addProject(addData);
        let item  = res.data
        item.attrs=this.tableData[0].attrs
        item.attrs.forEach(item1=>{
          item1.value=""
        })
        item.files=[]
        item.notes=[]

        this.project()
        this.$emit("project", item);
        this.$emit("isShowDetail");
      })
    },
    // 项目详情页
    detail(item) {
      this.$emit("isShowDetail");
      this.$emit("project", item);
    },
    //额外属性配置页
    attributeConfig() {
      this.$emit("isAttribute");
    },
    // 表格显示16行
    showtab(tableData) {
      this.tableData = tableData;
      if (this.tableData.length < 16) {
        const emptyLength = 16 - this.tableData.length;
        for (let i = 0; i < emptyLength; i++) {
          this.tableData.push({
            key: "empty" + i + 1,
            isEmpty: true,
          });
        }
      }
    },
    calcCount(count) {
      if (count % 16 == 0) {
        let page = parseInt(count / 16);
        this.allpage = page;
        this.showItem = page;
      } else {
        let page = parseInt(count / 16);
        this.allpage = page + 1;
        this.showItem = page + 1;
      }
    },
    // 请求查询所有
    async project() {
      let res = await this.$api.projectMessage.project();

      if(this.showData){
        res.data = [...this.newData,...res.data]
      }
      if(this.showData == false){
        res.data = res.data
      }
      res.data.forEach((item) => {
        (item._title = item.title),
          (item.checked = false),
          (item.ellipsis = false),
          (item.showCheck = false);
      });
      let count = res.data.length;
      // 判断页数
      this.calcCount(count);
      // 分页
      let start = this.current * this.pageSize;
      let end = (this.current + 1) * this.pageSize;
      //
      if (!this.typeSort && !this.scoreSort) {
        let tableData = res.data.slice(start, end);
        this.showtab(tableData);
        this.calcWidth();
      }
      // 按类型
      if (this.typeSort && !this.keyWord && !this.scoreSort) {
        if (this.typeSort == "全部项目") {
          let arr = res.data;
          // 判断页数
          let count = arr.length;
          this.calcCount(count);
          //
          let tableData = arr.slice(start, end);
          this.showtab(tableData);
          this.calcWidth();
        } else {
          let typeSort = this.typeSort;
          let arr = res.data.filter(function (item) {
            return item.type == typeSort;
          });
          // 判断页数
          let count = arr.length;
          this.calcCount(count);
          // 
          let tableData = arr.slice(start, end);
          this.showtab(tableData);
          this.calcWidth();
        }
      }
      // 按标记
      if (this.tagSort) {    
        var arrs = [];//定义一个数组存储筛选的标记
        for(var i=0;i<this.tagSort.length;i++){
          var tagSort = this.tagSort[i]
          var arr = res.data.filter(function (item){
            if (item.tags != null){
               return item.tags.indexOf(tagSort) >= 0;
            }
          })
          arrs.push(arr)
        }
        // 将筛选的标记数组合并
        let array = [];
          const middeleArray = arrs.reduce((a,b) => {
              return a.concat(b);
          });

        middeleArray.forEach((arrItem) => {
            if(array.indexOf(arrItem) == -1){
                array.push(arrItem);
            }
        });
        let tableData = array;
        let count = array.length;
        // 判断页数
        this.calcCount(count);
        //
        this.showtab(tableData.slice(start, end));
        this.calcWidth();
      }
      // 按关键字
      if (this.keyWord && !this.scoreSort && !this.typeSort && !this.tagSort) {
        let tableData = res.data.filter((item) => {
          return item.title != null && item.title.indexOf(this.keyWord) >= 0;
        });
        // 判断页数
        let count = tableData.length;
        this.calcCount(count);
        //
        this.showtab(tableData.slice(start, end));
        this.calcWidth();
      }
      // 按评分
      if ((this.scoreSort && !this.typeSort) || this.typeSort == "全部项目") {
        let scoreSort = this.scoreSort;
        let star = res.data.filter((item) => item.score >= scoreSort);
        //判断页数
        let count = star.length;
        this.calcCount(count);
        //
        let tableData = star.slice(start, end);
        this.showtab(tableData); //显示表格16行
        this.calcWidth();
      }
      // 按日期
      if (this.dateSort) {
        if (this.dateSort != "0") {
          let startDate = this.dateSort[0];
          let endDate = this.dateSort[1] + " 23:59";
          let s_date = new Date(startDate).toISOString();
          let e_date = new Date(endDate).toISOString();
          let arr = res.data.filter((item) => {
            return item.createTime >= s_date && item.createTime <= e_date;
          });
          //判断页数
          let count = arr.length;
          this.calcCount(count);
          //
          let tableData = arr.slice(start, end);
          this.showtab(tableData);
          this.calcWidth();
        } else {
          let arr = res.data;
          //判断页数
          let count = arr.length;
          this.calcCount(count);
          //
          let tableData = arr.slice(start, end);
          this.showtab(tableData);
          this.calcWidth();
        }
      }
      // 类型、评分
      if (this.typeSort && this.scoreSort) {
        var typeSort = this.typeSort
        var scoreSort = this.scoreSort
        if (this.typeSort == "全部项目") {
          let arr = res.data.filter(function (item) {
            return item.score >= scoreSort;
          });
          //判断页数
          let count = arr.length;
          this.calcCount(count);
          //
          let tableData = arr.slice(start, end);
          this.showtab(tableData);
          this.calcWidth();
        } else {
          let arr = res.data.filter(function (item) {
            return item.type == typeSort &&
             item.score >= scoreSort;
          });
          //判断页数
          let count = arr.length;
          this.calcCount(count);
          //
          let tableData = arr.slice(start, end);
          this.showtab(tableData);
          this.calcWidth();
        }
      }
      // 类型、关键字
      if (this.typeSort && this.keyWord) { 
        var keyWord = this.keyWord
        if (this.typeSort == "全部项目") {
          let arr = res.data.filter(function (item) {
            return item.title != null && item.title.indexOf(keyWord) >= 0;
          });
          // 判断页数
          let count = arr.length;
          this.calcCount(count);
          // 
          let tableData = arr.slice(start, end);
          this.showtab(tableData);
          this.calcWidth();
        } else {
          let typeSort = this.typeSort;
          let arr = res.data.filter(function (item) {
            return (
              item.type == typeSort &&
              item.title != null &&
              item.title.indexOf(keyWord) >= 0
            );
          });
          // 判断页数
          let count = arr.length;
          this.calcCount(count);
          // 
          let tableData = arr.slice(start, end);
          this.showtab(tableData);
          this.calcWidth();
        }
      }
      // 类型、日期
      if (this.typeSort && this.dateSort) {
        if (this.typeSort == "全部项目") {
          if (this.dateSort != "0") {
            let startDate = this.dateSort[0];
            let endDate = this.dateSort[1] + " 23:59";
            let s_date = new Date(startDate).toISOString();
            let e_date = new Date(endDate).toISOString();
            let arr = res.data.filter((item) => {
              return item.createTime >= s_date && item.createTime <= e_date;
            });
            // 判断页数
            let count = arr.length;
            this.calcCount(count);
            // 
            let tableData = arr.slice(start, end);
            this.showtab(tableData);
            this.calcWidth();
          } else {
            let arr = res.data;
            // 判断页数
            let count = arr.length;
            this.calcCount(count);
            // 
            let tableData = arr.slice(start, end);
            this.showtab(tableData);
            this.calcWidth();
          }
        } else {
          let typeSort = this.typeSort;
          if (this.dateSort != "0") {
            let startDate = this.dateSort[0];
            let endDate = this.dateSort[1] + " 23:59";
            let s_date = new Date(startDate).toISOString();
            let e_date = new Date(endDate).toISOString();
            let arr = res.data.filter((item) => {
              return (
                item.createTime >= s_date &&
                item.createTime <= e_date &&
                item.type == typeSort
              );
            });
            // 判断页数
            let count = arr.length;
            this.calcCount(count);
            // 
            let tableData = arr.slice(start, end);
            this.showtab(tableData);
            this.calcWidth();
          } else {
            let arr = res.data.filter((item) => {
              return item.type == typeSort;
            });
            // 判断页数
            let count = arr.length;
            this.calcCount(count);
            // 
            let tableData = arr.slice(start, end);
            this.showtab(tableData);
            this.calcWidth();
          }
        }
      }
      // 评分、关键字
      if (this.scoreSort && this.keyWord) {
        let scoreSort = this.scoreSort;
        let star = res.data.filter(
          (item) =>
            item.score >= scoreSort &&
            item.title != null &&
            item.title.indexOf(this.keyWord) >= 0
        );
        // 判断页数
        let count = star.length;
        this.calcCount(count);
        // 
        let tableData = star.slice(start, end);
        this.showtab(tableData);
        this.calcWidth();
      }
      // 评分、日期
      if (this.scoreSort && this.dateSort) {
        let scoreSort = this.scoreSort;
        if (this.dateSort != "0") {
          let startDate = this.dateSort[0];
          let endDate = this.dateSort[1] + " 23:59";
          let s_date = new Date(startDate).toISOString();
          let e_date = new Date(endDate).toISOString();
          let arr = res.data.filter((item) => {
            return (
              item.createTime >= s_date &&
              item.createTime <= e_date &&
              item.score >= scoreSort
            );
          });
          // 判断页数
          let count = arr.length;
          this.calcCount(count);
          // 
          let tableData = arr.slice(start, end);
          this.showtab(tableData);
          this.calcWidth();
        } else {
          let arr = res.data.filter((item) => item.score >= scoreSort);
          // 判断页数
          let count = arr.length;
          this.calcCount(count);
          // 
          let tableData = arr.slice(start, end);
          this.showtab(tableData);
          this.calcWidth();
        }
      }
      // 关键字、日期w
      if (this.keyWord && this.dateSort) {
        if (this.dateSort != "0") {
          let startDate = this.dateSort[0];
          let endDate = this.dateSort[1] + " 23:59";
          let s_date = new Date(startDate).toISOString();
          let e_date = new Date(endDate).toISOString();
          let arr = res.data.filter((item) => {
            return (
              item.createTime >= s_date &&
              item.createTime <= e_date &&
              item.title != null &&
              item.title.indexOf(this.keyWord) >= 0
            );
          });
          // 判断页数
          let count = arr.length;
          this.calcCount(count);
          // 
          let tableData = arr.slice(start, end);
          this.showtab(tableData);
          this.calcWidth();
        } else {
          let arr = res.data.filter(
            (item) =>
              item.title != null && item.title.indexOf(this.keyWord) >= 0
          );
          // 判断页数
          let count = arr.length;
          this.calcCount(count);
          // 
          let tableData = arr.slice(start, end);
          this.showtab(tableData);
          this.calcWidth();
        }
      }
      // 标记、类型
      if (this.tagSort && this.typeSort) {
        var typeSort = this.typeSort
        if (this.typeSort == "全部项目") {
          var arrs = [];//定义一个数组存储筛选的标记
          for(var i=0;i<this.tagSort.length;i++){
            var tagSort = this.tagSort[i]
            var arr = res.data.filter(function (item){
              if (item.tags != null){
                return item.tags.indexOf(tagSort) >= 0;
              }
            })
            arrs.push(arr)
          }
          // 将筛选的标记数组合并
          let array = [];
            const middeleArray = arrs.reduce((a,b) => {
                return a.concat(b);
            });

          middeleArray.forEach((arrItem) => {
              if(array.indexOf(arrItem) == -1){
                  array.push(arrItem);
              }
          });
          // 判断页数
          let count = array.length;
          this.calcCount(count);
          // 
          let tableData = array;
          this.showtab(tableData.slice(start, end));
          this.calcWidth();
        } else {
          var arrs = [];//定义一个数组存储筛选的标记
          for(var i=0;i<this.tagSort.length;i++){
            var tagSort = this.tagSort[i]
            var arr = res.data.filter(function (item){
              if (item.tags != null){
                return item.tags.indexOf(tagSort) >= 0 && item.type == typeSort;
              }
            })
            arrs.push(arr)
          }
          // 将筛选的标记数组合并
          let array = [];
            const middeleArray = arrs.reduce((a,b) => {
                return a.concat(b);
            });

          middeleArray.forEach((arrItem) => {
              if(array.indexOf(arrItem) == -1){
                  array.push(arrItem);
              }
          });
          // 判断页数
          let count = array.length;
          this.calcCount(count);
          // 
          let tableData = array;
          this.showtab(tableData);
          this.calcWidth();
        }
      }
      // 标记、关键字w
      if (this.tagSort && this.keyWord) {
        var keyWord = this.keyWord
        var arrs = [];//定义一个数组存储筛选的标记
        for(var i=0;i<this.tagSort.length;i++){
          var tagSort = this.tagSort[i]
          var arr = res.data.filter(function (item){
            if (item.tags != null){
               return item.tags.indexOf(tagSort) >= 0 && 
               item.title != null &&
               item.title.indexOf(keyWord) >= 0;
            }
          })
          arrs.push(arr)
        }
        // 将筛选的标记数组合并
        let array = [];
          const middeleArray = arrs.reduce((a,b) => {
              return a.concat(b);
          });

        middeleArray.forEach((arrItem) => {
            if(array.indexOf(arrItem) == -1){
                array.push(arrItem);
            }
        });
        // 判断页数
        let count = array.length;
        this.calcCount(count);
        // 
        let tableData = array;
        this.showtab(tableData.slice(start, end));
        this.calcWidth();
      }
      // 标记、评分
      if (this.tagSort && this.scoreSort) {
        var scoreSort = this.scoreSort;
        var arrs = [];//定义一个数组存储筛选的标记
        for(var i=0;i<this.tagSort.length;i++){
          var tagSort = this.tagSort[i]
          var arr = res.data.filter(function (item){
            if (item.tags != null){
              return item.tags.indexOf(tagSort) >= 0 &&
              item.score >= scoreSort;
            }
          })
          arrs.push(arr)
        }
        // 将筛选的标记数组合并
        let array = [];
          const middeleArray = arrs.reduce((a,b) => {
              return a.concat(b);
          });

        middeleArray.forEach((arrItem) => {
            if(array.indexOf(arrItem) == -1){
                array.push(arrItem);
            }
        });
        // 判断页数
        let count = array.length;
        this.calcCount(count);
        // 
        let tableData = array;
        this.showtab(tableData.slice(start, end));
        this.calcWidth();
      }
      // 标记、日期
      if (this.tagSort && this.dateSort) {
        var arrs = [];//定义一个数组存储筛选的标记
        for(var i=0;i<this.tagSort.length;i++){
          var tagSort = this.tagSort[i]
          if (this.dateSort != "0") {
            let startDate = this.dateSort[0];
            let endDate = this.dateSort[1] + " 23:59";
            let s_date = new Date(startDate).toISOString();
            let e_date = new Date(endDate).toISOString();
              var arr = res.data.filter(function (item){
                if (item.tags != null){
                  return item.tags.indexOf(tagSort) >= 0 &&
                  item.createTime >= s_date &&
                  item.createTime <= e_date;
                }
              })
              arrs.push(arr)
          } else {
            var arr = res.data.filter(function (item){
                if (item.tags != null){
                  return item.tags.indexOf(tagSort) >= 0;
                }
              })
              arrs.push(arr)
          }  
        }
        // 将筛选的标记数组合并
        let array = [];
          const middeleArray = arrs.reduce((a,b) => {
              return a.concat(b);
          });

        middeleArray.forEach((arrItem) => {
            if(array.indexOf(arrItem) == -1){
                array.push(arrItem);
            }
        });
        // 判断页数
        let count = array.length;
        this.calcCount(count);
        // 
        let tableData = array;
        this.showtab(tableData.slice(start, end));
        this.calcWidth();
      }
      // 类型、评分、关键字
      if (this.typeSort && this.scoreSort && this.keyWord) {
        if (this.typeSort == "全部项目") {
          let arr = res.data.filter(function (item) {
            return (
              item.score >= scoreSort &&
              item.title != null &&
              item.title.indexOf(keyWord) >= 0
            );
          });
          // 判断页数
          let count = arr.length;
          this.calcCount(count);
          // 
          let tableData = arr.slice(start, end);
          this.showtab(tableData);
          this.calcWidth();
        } else {
          let typeSort = this.typeSort;
          let scoreSort = this.scoreSort;
          let keyWord = this.keyWord;
          let arr = res.data.filter(function (item) {
            return (
              item.type == typeSort &&
              item.score >= scoreSort &&
              item.title != null &&
              item.title.indexOf(keyWord) >= 0
            );
          });
          // 判断页数
          let count = arr.length;
          this.calcCount(count);
          // 
          let tableData = arr.slice(start, end);
          this.showtab(tableData);
          this.calcWidth();
        }
      }
      // 类型、评分、日期w
      if (this.typeSort && this.scoreSort && this.dateSort) {
        if (this.typeSort == "全部项目") {
          if (this.dateSort != "0") {
            let startDate = this.dateSort[0];
            let endDate = this.dateSort[1] + " 23:59";
            let s_date = new Date(startDate).toISOString();
            let e_date = new Date(endDate).toISOString();
            let arr = res.data.filter((item) => {
              return (
                item.createTime >= s_date &&
                item.createTime <= e_date &&
                item.score >= scoreSort
              );
            });
            // 判断页数
            let count = arr.length;
            this.calcCount(count);
            // 
            let tableData = arr.slice(start, end);
            this.showtab(tableData);
            this.calcWidth();
          } else {
            let arr = res.data.filter((item) => {
              return item.score >= scoreSort;
            });
            // 判断页数
            let count = arr.length;
            this.calcCount(count);
            // 
            let tableData = arr.slice(start, end);
            this.showtab(tableData);
            this.calcWidth();
          }
        } else {
          let typeSort = this.typeSort;
          let scoreSort = this.scoreSort;
          if (this.dateSort != "0") {
            let startDate = this.dateSort[0];
            let endDate = this.dateSort[1] + " 23:59";
            let s_date = new Date(startDate).toISOString();
            let e_date = new Date(endDate).toISOString();
            let arr = res.data.filter((item) => {
              return (
                item.type == typeSort &&
                item.createTime >= s_date &&
                item.createTime <= e_date &&
                item.score >= scoreSort
              );
            });
            // 判断页数
            let count = arr.length;
            this.calcCount(count);
            // 
            let tableData = arr.slice(start, end);
            this.showtab(tableData);
            this.calcWidth();
          } else {
            let arr = res.data.filter((item) => {
              return item.type == typeSort && item.score >= scoreSort;
            });
            // 判断页数
            let count = arr.length;
            this.calcCount(count);
            // 
            let tableData = arr.slice(start, end);
            this.showtab(tableData);
            this.calcWidth();
          }
        }
      }
      // 类型、关键字、日期w
      if (this.typeSort && this.keyWord && this.dateSort) {
        if (this.typeSort == "全部项目") {
          if (this.dateSort != "0") {
            let startDate = this.dateSort[0];
            let endDate = this.dateSort[1] + " 23:59";
            let s_date = new Date(startDate).toISOString();
            let e_date = new Date(endDate).toISOString();
            let keyWord = this.keyWord;
            let arr = res.data.filter((item) => {
              return (
                item.createTime >= s_date &&
                item.createTime <= e_date &&
                item.title != null &&
                item.title.indexOf(keyWord) >= 0
              );
            });
            // 判断页数
            let count = arr.length;
            this.calcCount(count);
            // 
            let tableData = arr.slice(start, end);
            this.showtab(tableData);
            this.calcWidth();
          } else {
            let keyWord = this.keyWord;
            let arr = res.data.filter((item) => {
              return item.title != null && item.title.indexOf(keyWord) >= 0;
            });
            // 判断页数
            let count = arr.length;
            this.calcCount(count);
            // 
            let tableData = arr.slice(start, end);
            this.showtab(tableData);
            this.calcWidth();
          }
        } else {
          let typeSort = this.typeSort;
          if (this.dateSort != "0") {
            let startDate = this.dateSort[0];
            let endDate = this.dateSort[1] + " 23:59";
            let s_date = new Date(startDate).toISOString();
            let e_date = new Date(endDate).toISOString();
            let keyWord = this.keyWord;
            let arr = res.data.filter((item) => {
              return (
                item.createTime >= s_date &&
                item.createTime <= e_date &&
                item.type == typeSort &&
                item.title != null &&
                item.title.indexOf(keyWord) >= 0
              );
            });
            // 判断页数
            let count = arr.length;
            this.calcCount(count);
            // 
            let tableData = arr.slice(start, end);
            this.showtab(tableData);
            this.calcWidth();
          } else {
            let keyWord = this.keyWord;
            let arr = res.data.filter((item) => {
              return (
                item.type == typeSort &&
                item.title != null &&
                item.title.indexOf(keyWord) >= 0
              );
            });
            // 判断页数
            let count = arr.length;
            this.calcCount(count);
            //  
            let tableData = arr.slice(start, end);
            this.showtab(tableData);
            this.calcWidth();
          }
        }
      }
      // 类型、标记、关键字w
      if (this.typeSort && this.tagSort && this.keyWord) {
        var keyWord = this.keyWord;
        if (this.typeSort == "全部项目") {
         var arrs = [];//定义一个数组存储筛选的标记
          for(var i=0;i<this.tagSort.length;i++){
            var tagSort = this.tagSort[i]
            var arr = res.data.filter(function (item){
              if (item.tags != null){
                return item.tags.indexOf(tagSort) >= 0 && 
               item.title != null &&
               item.title.indexOf(keyWord) >= 0;
              }
            })
            arrs.push(arr)
          }
          // 将筛选的标记数组合并
          let array = [];
            const middeleArray = arrs.reduce((a,b) => {
                return a.concat(b);
            });

          middeleArray.forEach((arrItem) => {
              if(array.indexOf(arrItem) == -1){
                  array.push(arrItem);
              }
          });
          // 判断页数
          let count = array.length;
          this.calcCount(count);
          // 
          let tableData = array;
          this.showtab(tableData.slice(start, end));
          this.calcWidth();
        } else {
          var arrs = [];//定义一个数组存储筛选的标记
          for(var i=0;i<this.tagSort.length;i++){
            var tagSort = this.tagSort[i]
            var arr = res.data.filter(function (item){
              if (item.tags != null){
                return item.tags.indexOf(tagSort) >= 0 && 
                item.type == typeSort && 
                item.title != null &&
                item.title.indexOf(keyWord) >= 0;
              }
            })
            arrs.push(arr)
          }
          // 将筛选的标记数组合并
          let array = [];
            const middeleArray = arrs.reduce((a,b) => {
                return a.concat(b);
            });

          middeleArray.forEach((arrItem) => {
              if(array.indexOf(arrItem) == -1){
                  array.push(arrItem);
              }
          });
          // 判断页数
          let count = array.length;
          this.calcCount(count);
          // 
          let tableData = array;
          this.showtab(tableData.slice(start, end));
          this.calcWidth();
        }
      }
      // 类型、标记、评分w
      if (this.typeSort && this.tagSort && this.scoreSort) {
        var typeSort = this.typeSort
        var scoreSort = this.scoreSort
        if (this.typeSort == "全部项目") {
          var arrs = [];//定义一个数组存储筛选的标记
          for(var i=0;i<this.tagSort.length;i++){
            var tagSort = this.tagSort[i]
            var arr = res.data.filter(function (item){
              if (item.tags != null){
                return item.tags.indexOf(tagSort) >= 0 && 
                item.score >= scoreSort;
              }
            })
            arrs.push(arr)
          }
          // 将筛选的标记数组合并
          let array = [];
            const middeleArray = arrs.reduce((a,b) => {
                return a.concat(b);
            });

          middeleArray.forEach((arrItem) => {
              if(array.indexOf(arrItem) == -1){
                  array.push(arrItem);
              }
          });
          // 判断页数
          let count = array.length;
          this.calcCount(count);
          // 
          let tableData = array;
          this.showtab(tableData.slice(start, end));
          this.calcWidth();
        } else {
          var arrs = [];//定义一个数组存储筛选的标记
          for(var i=0;i<this.tagSort.length;i++){
            var tagSort = this.tagSort[i]
            var arr = res.data.filter(function (item){
              if (item.tags != null){
                return item.tags.indexOf(tagSort) >= 0 &&
                 item.type == typeSort && 
                 item.score >= scoreSort;
              }
            })
            arrs.push(arr)
          }
          // 将筛选的标记数组合并
          let array = [];
            const middeleArray = arrs.reduce((a,b) => {
                return a.concat(b);
            });

          middeleArray.forEach((arrItem) => {
              if(array.indexOf(arrItem) == -1){
                  array.push(arrItem);
              }
          });
          // 判断页数
          let count = array.length;
          this.calcCount(count);
          // 
          let tableData = array;
          this.showtab(tableData.slice(start, end));
          this.calcWidth();
        }
      }
      // 类型、标记、日期w
      if (this.typeSort && this.tagSort && this.dateSort) {
        var typeSort = this.typeSort
        if (this.typeSort == "全部项目") {
          var arrs = [];//定义一个数组存储筛选的标记
          for(var i=0;i<this.tagSort.length;i++){
          var tagSort = this.tagSort[i]
          if (this.dateSort != "0") {
            let startDate = this.dateSort[0];
            let endDate = this.dateSort[1] + " 23:59";
            let s_date = new Date(startDate).toISOString();
            let e_date = new Date(endDate).toISOString();
              var arr = res.data.filter(function (item){
                if (item.tags != null){
                  return item.tags.indexOf(tagSort) >= 0 &&
                  item.createTime >= s_date &&
                  item.createTime <= e_date;
                }
              })
              arrs.push(arr)
          } else {
            var arr = res.data.filter(function (item){
                if (item.tags != null){
                  return item.tags.indexOf(tagSort) >= 0;
                }
              })
              arrs.push(arr)
          }  
        }
          // 将筛选的标记数组合并
          let array = [];
            const middeleArray = arrs.reduce((a,b) => {
                return a.concat(b);
            });

          middeleArray.forEach((arrItem) => {
              if(array.indexOf(arrItem) == -1){
                  array.push(arrItem);
              }
          });
          // 判断页数
          let count = array.length;
          this.calcCount(count);
          // 
          let tableData = array;
          this.showtab(tableData.slice(start, end));
          this.calcWidth();
        } else {
          var arrs = [];//定义一个数组存储筛选的标记
          for(var i=0;i<this.tagSort.length;i++){
            var tagSort = this.tagSort[i]
            if (this.dateSort != "0") {
              let startDate = this.dateSort[0];
              let endDate = this.dateSort[1] + " 23:59";
              let s_date = new Date(startDate).toISOString();
              let e_date = new Date(endDate).toISOString();
                var arr = res.data.filter(function (item){
                  if (item.tags != null){
                    return item.tags.indexOf(tagSort) >= 0 &&
                    item.createTime >= s_date &&
                    item.createTime <= e_date &&
                    item.type == typeSort;
                  }
                })
                arrs.push(arr)
            } else {
              var arr = res.data.filter(function (item){
                  if (item.tags != null){
                    return item.tags.indexOf(tagSort) >= 0 &&
                    item.type == typeSort;
                  }
                })
                arrs.push(arr)
            }  
          }
          // 将筛选的标记数组合并
          let array = [];
            const middeleArray = arrs.reduce((a,b) => {
                return a.concat(b);
            });

          middeleArray.forEach((arrItem) => {
              if(array.indexOf(arrItem) == -1){
                  array.push(arrItem);
              }
          });
          // 判断页数
          let count = array.length;
          this.calcCount(count);
          // 
          let tableData = array;
          this.showtab(tableData.slice(start, end));
          this.calcWidth();
        }
      }
      // 标记、关键字、评分w
      if (this.tagSort && this.keyWord && this.scoreSort) {
        var keyWord = this.keyWord
        var scoreSort = this.scoreSort;
        var arrs = [];//定义一个数组存储筛选的标记
        for(var i=0;i<this.tagSort.length;i++){
          var tagSort = this.tagSort[i]
          var arr = res.data.filter(function (item){
            if (item.tags != null){
               return item.tags.indexOf(tagSort) >= 0 && 
               item.title != null &&
               item.title.indexOf(keyWord) >= 0 &&
               item.score >= scoreSort;
            }
          })
          arrs.push(arr)
        }
        // 将筛选的标记数组合并
        let array = [];
          const middeleArray = arrs.reduce((a,b) => {
              return a.concat(b);
          });

        middeleArray.forEach((arrItem) => {
            if(array.indexOf(arrItem) == -1){
                array.push(arrItem);
            }
        });
        // 判断页数
        let count = array.length;
        this.calcCount(count);
        // 
        let tableData = array;
        this.showtab(tableData.slice(start, end));
        this.calcWidth();
      }
      // 标记、关键字、日期w
      if (this.tagSort && this.keyWord && this.dateSort) {
        var keyWord = this.keyWord
        var arrs = [];//定义一个数组存储筛选的标记
        for(var i=0;i<this.tagSort.length;i++){
          var tagSort = this.tagSort[i]
          if (this.dateSort != "0") {
            let startDate = this.dateSort[0];
            let endDate = this.dateSort[1] + " 23:59";
            let s_date = new Date(startDate).toISOString();
            let e_date = new Date(endDate).toISOString();
              var arr = res.data.filter(function (item){
                if (item.tags != null){
                  return item.tags.indexOf(tagSort) >= 0 &&
                  item.createTime >= s_date &&
                  item.createTime <= e_date && 
                  item.title != null &&
                  item.title.indexOf(keyWord) >= 0;
                }
              })
              arrs.push(arr)
          } else {
            var arr = res.data.filter(function (item){
                if (item.tags != null){
                  return item.tags.indexOf(tagSort) >= 0 && 
                  item.title != null &&
                  item.title.indexOf(keyWord) >= 0;
                }
              })
              arrs.push(arr)
          }  
        }
        // 将筛选的标记数组合并
        let array = [];
          const middeleArray = arrs.reduce((a,b) => {
              return a.concat(b);
          });

        middeleArray.forEach((arrItem) => {
            if(array.indexOf(arrItem) == -1){
                array.push(arrItem);
            }
        });
        // 判断页数
        let count = array.length;
        this.calcCount(count);
        // 
        let tableData = array;
        this.showtab(tableData.slice(start, end));
        this.calcWidth();
      }
      //标记、评分、日期w
      if (this.tagSort && this.scoreSort && this.dateSort) {
        var scoreSort = this.scoreSort;
        var arrs = [];//定义一个数组存储筛选的标记
        for(var i=0;i<this.tagSort.length;i++){
          var tagSort = this.tagSort[i]
          if (this.dateSort != "0") {
            let startDate = this.dateSort[0];
            let endDate = this.dateSort[1] + " 23:59";
            let s_date = new Date(startDate).toISOString();
            let e_date = new Date(endDate).toISOString();
              var arr = res.data.filter(function (item){
                if (item.tags != null){
                  return item.tags.indexOf(tagSort) >= 0 &&
                  item.createTime >= s_date &&
                  item.createTime <= e_date &&
                  item.score >= scoreSort;
                }
              })
              arrs.push(arr)
          } else {
            var arr = res.data.filter(function (item){
                if (item.tags != null){
                  return item.tags.indexOf(tagSort) >= 0 && 
                  item.score >= scoreSort;
                }
              })
              arrs.push(arr)
          }  
        }
        // 将筛选的标记数组合并
        let array = [];
          const middeleArray = arrs.reduce((a,b) => {
              return a.concat(b);
          });

        middeleArray.forEach((arrItem) => {
            if(array.indexOf(arrItem) == -1){
                array.push(arrItem);
            }
        });
        // 判断页数
        let count = array.length;
        this.calcCount(count);
        // 
        let tableData = array;
        this.showtab(tableData.slice(start, end));
        this.calcWidth();
      }
      // 关键字、评分、日期w
      if (this.keyWord && this.scoreSort && this.dateSort) {
        let scoreSort = this.scoreSort;
        let keyWord = this.keyWord;
        if (this.dateSort != "0") {
          let startDate = this.dateSort[0];
          let endDate = this.dateSort[1] + " 23:59";
          let s_date = new Date(startDate).toISOString();
          let e_date = new Date(endDate).toISOString();
          let arr = res.data.filter((item) => {
            return (
              item.createTime >= s_date &&
              item.createTime <= e_date &&
              item.score >= scoreSort &&
              item.title != null &&
              item.title.indexOf(keyWord) >= 0
            );
          });
          // 判断页数
          let count = arr.length;
          this.calcCount(count);
          // 
          let tableData = arr.slice(start, end);
          this.showtab(tableData);
          this.calcWidth();
        } else {
          let arr = res.data.filter(
            (item) =>
              item.score >= scoreSort &&
              item.title != null &&
              item.title.indexOf(keyWord) >= 0
          );
          // 判断页数
          let count = arr.length;
          this.calcCount(count);
          // 
          let tableData = arr.slice(start, end);
          this.showtab(tableData);
          this.calcWidth();
        }
      }
      // 类型、标记、关键字、评分w
      if (this.typeSort && this.tagSort && this.keyWord && this.scoreSort) {
        var typeSort = this.typeSort
        var keyWord = this.keyWord
        var scoreSort = this.scoreSort
        if (this.typeSort == "全部项目") {
          var arrs = [];//定义一个数组存储筛选的标记
          for(var i=0;i<this.tagSort.length;i++){
            var tagSort = this.tagSort[i]
            var arr = res.data.filter(function (item){
              if (item.tags != null){
                return item.tags.indexOf(tagSort) >= 0 &&
                item.title != null &&
                item.title.indexOf(keyWord) >= 0 &&
                item.score >= scoreSort;
              }
            })
            arrs.push(arr)
          }
          // 将筛选的标记数组合并
          let array = [];
            const middeleArray = arrs.reduce((a,b) => {
                return a.concat(b);
            });

          middeleArray.forEach((arrItem) => {
              if(array.indexOf(arrItem) == -1){
                  array.push(arrItem);
              }
          });
          // 判断页数
          let count = array.length;
          this.calcCount(count);
          // 
          let tableData = array;
          this.showtab(tableData.slice(start, end));
          this.calcWidth();
        } else {
          var arrs = [];//定义一个数组存储筛选的标记
          for(var i=0;i<this.tagSort.length;i++){
            var tagSort = this.tagSort[i]
            var arr = res.data.filter(function (item){
              if (item.tags != null){
                return item.tags.indexOf(tagSort) >= 0 &&
                  item.type == typeSort &&
                  item.title != null &&
                  item.title.indexOf(keyWord) >= 0 &&
                  item.score >= scoreSort;;
              }
            })
            arrs.push(arr)
          }
          // 将筛选的标记数组合并
          let array = [];
            const middeleArray = arrs.reduce((a,b) => {
                return a.concat(b);
            });

          middeleArray.forEach((arrItem) => {
              if(array.indexOf(arrItem) == -1){
                  array.push(arrItem);
              }
          });
          // 判断页数
          let count = array.length;
          this.calcCount(count);
          // 
          let tableData = array;
          this.showtab(tableData.slice(start, end));
          this.calcWidth();
        }
      }
      // 类型、标记、关键字、日期w
      if (this.typeSort && this.tagSort && this.keyWord && this.dateSort) {
        var typeSort = this.typeSort
        var keyWord = this.keyWord
        if (this.typeSort == "全部项目") {
          var arrs = [];//定义一个数组存储筛选的标记
          for(var i=0;i<this.tagSort.length;i++){
          var tagSort = this.tagSort[i]
          if (this.dateSort != "0") {
            let startDate = this.dateSort[0];
            let endDate = this.dateSort[1] + " 23:59";
            let s_date = new Date(startDate).toISOString();
            let e_date = new Date(endDate).toISOString();
              var arr = res.data.filter(function (item){
                if (item.tags != null){
                  return item.tags.indexOf(tagSort) >= 0 &&
                  item.createTime >= s_date &&
                  item.createTime <= e_date &&
                  item.title != null &&
                  item.title.indexOf(keyWord) >= 0;
                }
              })
              arrs.push(arr)
          } else {
            var arr = res.data.filter(function (item){
                if (item.tags != null){
                  return item.tags.indexOf(tagSort) >= 0 &&
                    item.title != null &&
                    item.title.indexOf(keyWord) >= 0;
                }
              })
              arrs.push(arr)
          }  
        }
          // 将筛选的标记数组合并
          let array = [];
            const middeleArray = arrs.reduce((a,b) => {
                return a.concat(b);
            });

          middeleArray.forEach((arrItem) => {
              if(array.indexOf(arrItem) == -1){
                  array.push(arrItem);
              }
          });
          // 判断页数
          let count = array.length;
          this.calcCount(count);
          // 
          let tableData = array;
          this.showtab(tableData.slice(start, end));
          this.calcWidth();
        } else {
          var arrs = [];//定义一个数组存储筛选的标记
          for(var i=0;i<this.tagSort.length;i++){
            var tagSort = this.tagSort[i]
            if (this.dateSort != "0") {
              let startDate = this.dateSort[0];
              let endDate = this.dateSort[1] + " 23:59";
              let s_date = new Date(startDate).toISOString();
              let e_date = new Date(endDate).toISOString();
                var arr = res.data.filter(function (item){
                  if (item.tags != null){
                    return item.tags.indexOf(tagSort) >= 0 &&
                    item.createTime >= s_date &&
                    item.createTime <= e_date &&
                    item.type == typeSort &&
                    item.title != null &&
                    item.title.indexOf(keyWord) >= 0;
                  }
                })
                arrs.push(arr)
            } else {
              var arr = res.data.filter(function (item){
                  if (item.tags != null){
                    return item.tags.indexOf(tagSort) >= 0 &&
                    item.type == typeSort &&
                    item.title != null &&
                    item.title.indexOf(keyWord) >= 0;
                  }
                })
                arrs.push(arr)
            }  
          }
          // 将筛选的标记数组合并
          let array = [];
            const middeleArray = arrs.reduce((a,b) => {
                return a.concat(b);
            });

          middeleArray.forEach((arrItem) => {
              if(array.indexOf(arrItem) == -1){
                  array.push(arrItem);
              }
          });
          // 判断页数
          let count = array.length;
          this.calcCount(count);
          // 
          let tableData = array;
          this.showtab(tableData.slice(start, end));
          this.calcWidth();
        }
      }
      // 标记、关键字、评分、日期w
      if (this.tagSort && this.keyWord && this.scoreSort && this.dateSort) {
        var scoreSort = this.scoreSort;
        var keyWord = this.keyWord
        var arrs = [];//定义一个数组存储筛选的标记
        for(var i=0;i<this.tagSort.length;i++){
          var tagSort = this.tagSort[i]
          if (this.dateSort != "0") {
            let startDate = this.dateSort[0];
            let endDate = this.dateSort[1] + " 23:59";
            let s_date = new Date(startDate).toISOString();
            let e_date = new Date(endDate).toISOString();
              var arr = res.data.filter(function (item){
                if (item.tags != null){
                  return item.tags.indexOf(tagSort) >= 0 &&
                  item.createTime >= s_date &&
                  item.createTime <= e_date &&
                  item.score >= scoreSort &&
                  item.title != null &&
                  item.title.indexOf(keyWord) >= 0;
                }
              })
              arrs.push(arr)
          } else {
            var arr = res.data.filter(function (item){
                if (item.tags != null){
                  return item.tags.indexOf(tagSort) >= 0 && 
                  item.score >= scoreSort &&
                  item.title != null &&
                  item.title.indexOf(keyWord) >= 0;
                }
              })
              arrs.push(arr)
          }  
        }
        // 将筛选的标记数组合并
        let array = [];
          const middeleArray = arrs.reduce((a,b) => {
              return a.concat(b);
          });

        middeleArray.forEach((arrItem) => {
            if(array.indexOf(arrItem) == -1){
                array.push(arrItem);
            }
        });
        // 判断页数
        let count = array.length;
        this.calcCount(count);
        // 
        let tableData = array;
        this.showtab(tableData.slice(start, end));
        this.calcWidth();
      }
      // 类型、标记、评分、日期w
      if (this.typeSort && this.tagSort && this.scoreSort && this.dateSort) {
        var typeSort = this.typeSort
        var scoreSort = this.scoreSort
        if (this.typeSort == "全部项目") {
          var arrs = [];//定义一个数组存储筛选的标记
          for(var i=0;i<this.tagSort.length;i++){
          var tagSort = this.tagSort[i]
          if (this.dateSort != "0") {
            let startDate = this.dateSort[0];
            let endDate = this.dateSort[1] + " 23:59";
            let s_date = new Date(startDate).toISOString();
            let e_date = new Date(endDate).toISOString();
              var arr = res.data.filter(function (item){
                if (item.tags != null){
                  return item.tags.indexOf(tagSort) >= 0 &&
                  item.createTime >= s_date &&
                  item.createTime <= e_date &&
                  item.score >= scoreSort;
                }
              })
              arrs.push(arr)
          } else {
            var arr = res.data.filter(function (item){
                if (item.tags != null){
                  return item.tags.indexOf(tagSort) >= 0 &&
                    item.score >= scoreSort;
                }
              })
              arrs.push(arr)
          }  
        }
          // 将筛选的标记数组合并
          let array = [];
            const middeleArray = arrs.reduce((a,b) => {
                return a.concat(b);
            });

          middeleArray.forEach((arrItem) => {
              if(array.indexOf(arrItem) == -1){
                  array.push(arrItem);
              }
          });
          // 判断页数
          let count = array.length;
          this.calcCount(count);
          // 
          let tableData = array;
          this.showtab(tableData.slice(start, end));
          this.calcWidth();
        } else {
          var arrs = [];//定义一个数组存储筛选的标记
          for(var i=0;i<this.tagSort.length;i++){
            var tagSort = this.tagSort[i]
            if (this.dateSort != "0") {
              let startDate = this.dateSort[0];
              let endDate = this.dateSort[1] + " 23:59";
              let s_date = new Date(startDate).toISOString();
              let e_date = new Date(endDate).toISOString();
                var arr = res.data.filter(function (item){
                  if (item.tags != null){
                    return item.tags.indexOf(tagSort) >= 0 &&
                    item.createTime >= s_date &&
                    item.createTime <= e_date &&
                    item.type == typeSort &&
                    item.score >= scoreSort;
                  }
                })
                arrs.push(arr)
            } else {
              var arr = res.data.filter(function (item){
                  if (item.tags != null){
                    return item.tags.indexOf(tagSort) >= 0 &&
                    item.type == typeSort &&
                    item.score >= scoreSort;
                  }
                })
                arrs.push(arr)
            }  
          }
          // 将筛选的标记数组合并
          let array = [];
            const middeleArray = arrs.reduce((a,b) => {
                return a.concat(b);
            });

          middeleArray.forEach((arrItem) => {
              if(array.indexOf(arrItem) == -1){
                  array.push(arrItem);
              }
          });
          // 判断页数
          let count = array.length;
          this.calcCount(count);
          // 
          let tableData = array;
          this.showtab(tableData.slice(start, end));
          this.calcWidth();
        }
      }
      // 类型、关键字、评分、日期
      if (this.typeSort && this.keyWord && this.scoreSort && this.dateSort) {
        var scoreSort = this.scoreSort
        if (this.typeSort == "全部项目") {
          if (this.dateSort != "0") {
            let startDate = this.dateSort[0];
            let endDate = this.dateSort[1] + " 23:59";
            let s_date = new Date(startDate).toISOString();
            let e_date = new Date(endDate).toISOString();
            let keyWord = this.keyWord;
            let arr = res.data.filter((item) => {
              return (
                item.createTime >= s_date &&
                item.createTime <= e_date &&
                item.title != null &&
                item.title.indexOf(keyWord) >= 0 &&
                item.score >= scoreSort
              );
            });
            // 判断页数
            let count = arr.length;
            this.calcCount(count);
            // 
            let tableData = arr.slice(start, end);
            this.showtab(tableData);
            this.calcWidth();
          } else {
            let keyWord = this.keyWord;
            let arr = res.data.filter((item) => {
              return item.title != null &&
               item.title.indexOf(keyWord) >= 0 &&
               item.score >= scoreSort;
            });
            // 判断页数
            let count = arr.length;
            this.calcCount(count);
            // 
            let tableData = arr.slice(start, end);
            this.showtab(tableData);
            this.calcWidth();
          }
        } else {
          let typeSort = this.typeSort;
          if (this.dateSort != "0") {
            let startDate = this.dateSort[0];
            let endDate = this.dateSort[1] + " 23:59";
            let s_date = new Date(startDate).toISOString();
            let e_date = new Date(endDate).toISOString();
            let keyWord = this.keyWord;
            let arr = res.data.filter((item) => {
              return (
                item.createTime >= s_date &&
                item.createTime <= e_date &&
                item.type == typeSort &&
                item.title != null &&
                item.title.indexOf(keyWord) >= 0 &&
                item.score >= scoreSort
              );
            });
            // 判断页数
            let count = arr.length;
            this.calcCount(count);
            // 
            let tableData = arr.slice(start, end);
            this.showtab(tableData);
            this.calcWidth();
          } else {
            let keyWord = this.keyWord;
            let arr = res.data.filter((item) => {
              return (
                item.type == typeSort &&
                item.title != null &&
                item.title.indexOf(keyWord) >= 0 &&
                item.score >= scoreSort
              );
            });
            // 判断页数
            let count = arr.length;
            this.calcCount(count);
            // 
            let tableData = arr.slice(start, end);
            this.showtab(tableData);
            this.calcWidth();
          }
        }
      }
      // 类型、标记、关键字、评分、日期
      if (this.typeSort && this.tagSort && this.keyWord && this.scoreSort && this.dateSort) {
        var typeSort = this.typeSort
        var scoreSort = this.scoreSort
        var keyWord = this.keyWord
        if (this.typeSort == "全部项目") {
          var arrs = [];//定义一个数组存储筛选的标记
          for(var i=0;i<this.tagSort.length;i++){
          var tagSort = this.tagSort[i]
          if (this.dateSort != "0") {
            let startDate = this.dateSort[0];
            let endDate = this.dateSort[1] + " 23:59";
            let s_date = new Date(startDate).toISOString();
            let e_date = new Date(endDate).toISOString();
              var arr = res.data.filter(function (item){
                if (item.tags != null){
                  return item.tags.indexOf(tagSort) >= 0 &&
                  item.createTime >= s_date &&
                  item.createTime <= e_date &&
                  item.score >= scoreSort &&
                  item.title != null &&
                  item.title.indexOf(keyWord) >= 0;
                }
              })
              arrs.push(arr)
          } else {
            var arr = res.data.filter(function (item){
                if (item.tags != null){
                  return item.tags.indexOf(tagSort) >= 0 &&
                    item.score >= scoreSort &&
                    item.title != null &&
                    item.title.indexOf(keyWord) >= 0;
                }
              })
              arrs.push(arr)
          }  
        }
          // 将筛选的标记数组合并
          let array = [];
            const middeleArray = arrs.reduce((a,b) => {
                return a.concat(b);
            });

          middeleArray.forEach((arrItem) => {
              if(array.indexOf(arrItem) == -1){
                  array.push(arrItem);
              }
          });
          // 判断页数
          let count = array.length;
          this.calcCount(count);
          // 
          let tableData = array;
          this.showtab(tableData.slice(start, end));
          this.calcWidth();
        } else {
          var arrs = [];//定义一个数组存储筛选的标记
          for(var i=0;i<this.tagSort.length;i++){
            var tagSort = this.tagSort[i]
            if (this.dateSort != "0") {
              let startDate = this.dateSort[0];
              let endDate = this.dateSort[1] + " 23:59";
              let s_date = new Date(startDate).toISOString();
              let e_date = new Date(endDate).toISOString();
                var arr = res.data.filter(function (item){
                  if (item.tags != null){
                    return item.tags.indexOf(tagSort) >= 0 &&
                    item.createTime >= s_date &&
                    item.createTime <= e_date &&
                    item.type == typeSort &&
                    item.score >= scoreSort &&
                    item.title != null &&
                    item.title.indexOf(keyWord) >= 0;
                  }
                })
                arrs.push(arr)
            } else {
              var arr = res.data.filter(function (item){
                  if (item.tags != null){
                    return item.tags.indexOf(tagSort) >= 0 &&
                    item.type == typeSort &&
                    item.score >= scoreSort &&
                    item.title != null &&
                    item.title.indexOf(keyWord) >= 0;
                  }
                })
                arrs.push(arr)
            }  
          }
          // 将筛选的标记数组合并
          let array = [];
            const middeleArray = arrs.reduce((a,b) => {
                return a.concat(b);
            });

          middeleArray.forEach((arrItem) => {
              if(array.indexOf(arrItem) == -1){
                  array.push(arrItem);
              }
          });
          // 判断页数
          let count = array.length;
          this.calcCount(count);
          // 
          let tableData = array;
          this.showtab(tableData.slice(start, end));
          this.calcWidth();
        }
      }
    },
  },
  watch: {
    // 类型分类
    getType() {
      this.typeSort = this.getType;
      this.project();
    },
    // 标记分类
    getTag() {
      this.tagSort = this.getTag;
      this.project();
    },
    // 分数分类
    getScore() {
      this.scoreSort = this.getScore;
      this.project();
    },
    // 时间分类
    getDate() {
      this.dateSort = this.getDate;
      this.project();
    },
    // 关键字分类
    getWord() {
      this.keyWord = this.getWord;
      this.project();
    },
    // home获取来的表格数据
    prodata(){
      this.project()
    },
    showData(val){
    this.project()
    },
  },
};
</script>

<style lang="scss" scoped>
@import "./table.scss";
</style>
